<?php
declare(strict_types=1);

namespace LowCode\Naive;

use Closure;
use LowCode\Naive;
use LowCode\Traits\Props\HasAffix;

/**
 * 组件 - 侧边导航 NAnchor
 * @method static static make(array $children = []) Anchor组件
 */
class Anchor extends Naive
{

    use HasAffix;

    public function __construct(array $children = [])
    {
        parent::__construct();
        $this->children($children);
    }

    /**
     * Anchor 是否像 Affix 一样展示，如果设定为 true，它还会接受 Affix 的 Props
     * @param bool $bool
     * @return $this
     */
    public function affix(bool $bool = true): static
    {
        return $this->prop('affix', $bool);
    }

    /**
     * 元素开始触发 anchor 的偏移量
     * @param int $bound
     * @return $this
     */
    public function bound(int $bound = 12): static
    {
        return $this->prop('bound', $bound);
    }

    /**
     * 如果设定为 true, 导航将显示在准确的 href 区域
     * @param bool $bool
     * @return $this
     */
    public function ignoreGap(bool $bool = true): static
    {
        return $this->prop('ignoreGap', $bool);
    }

    /**
     * 是否展示侧面的轨道
     * @param bool $bool
     * @return $this
     */
    public function showRail(bool $bool = true): static
    {
        return $this->prop('showRail', $bool);
    }

    /**
     * 是否展示 link 的背景
     * @param bool $bool
     * @return $this
     */
    public function showBackground(bool $bool = true): static
    {
        return $this->prop('showBackground', $bool);
    }

    /**
     * Anchor 的风格，'block' 为块状风格，'rail' 为轨道风格
     * @param string $type 'rail' | 'block'
     * @return $this
     */
    public function type(string $type = 'rail' | 'block'): static
    {
        return $this->prop('type', $type);
    }

    /**
     * Anchor rail 轨道风格
     * @return $this
     */
    public function rail(): Anchor
    {
        return $this->type('rail');
    }

    /**
     * Anchor block 轨道风格
     * @return $this
     */
    public function block(): Anchor
    {
        return $this->type('block');
    }

    /**
     * 计算偏移位置相对的元素或选择器。如果你滚动的不是整个文档而只是其中的一部分，那你有可能要设定这个
     * @param string $offsetTarget string | HTMLElement | Window | Document | (() => HTMLElement)
     * @return $this
     */
    public function offsetTarget(string $offsetTarget): Anchor
    {
        return $this->prop('offsetTarget', $offsetTarget);
    }


    /**
     * 设置新数据锚点链接
     * @param string|null $title
     * @param string $href
     * @param array|Closure $children
     * @return $this
     */
    public function link(string $title = null, string $href = "", array|Closure $children = []): Anchor
    {
        $options = $this->get("children",[]);
        $link = new AnchorLink($title, $href, $children);
        $options[] = $link;
        return $this->children($children);
    }
}
